<%@ page language="java" import="org.apache.struts2.ServletActionContext" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<base href="<%=basePath%>">
	<TITLE>产品列表</TITLE>
	<META content="text/html; charset=utf-8" http-equiv="Content-Type">
	<LINK rel="stylesheet" type="text/css" href="common/css/css.css">
	<LINK rel="stylesheet" type="text/css" href="common/css/jquery-ui.css">
	
	<SCRIPT type="text/javascript" src="common/jquery-1.5.1.js"></SCRIPT>
	<SCRIPT type="text/javascript" src="common/js.js"></SCRIPT>
	<SCRIPT>
		$(function() {
			var b_w = $('body').width(), w_w = (b_w - 1440) / 2;
			$('#wrap').css({
				left : w_w
			});
		})
	</SCRIPT>
	<META name="GENERATOR" content="MSHTML 10.00.8102.0">
</head>
<body onresize="test()" onload="loading()">
<DIV id="loading"><IMG src="common/loading.gif"></DIV>
<DIV class="header">
<DIV class="header-main">
<DIV class="header-top">
	<UL class="menu">
		<LI><A class="aa" href="">主页</A></LI>
		<LI><A class="bb" href="javascript:void(0)">交流</A></LI>
		<LI><A class="cc" href="javascript:void(0)">文章</A></LI>
		<LI><A class="dd" href="javascript:void(0)">简历</A></LI>
		<LI><A class="ee" href="towelAction_findPage.action?pageNum=1&pageSize=${page.pageSize }&categoryId=-1">产品</A></LI>
		<LI><A class="ff" href="javascript:void(0)">霍氏族谱</A></LI>
	</UL>
</DIV>
</DIV>
<DIV class="header-bot"></DIV>
<DIV class="show"><IMG src="common/nav-hidden.gif" width="41" height="22"></DIV>
</DIV>

<SCRIPT type="text/javascript">
$(function(){
		var oj=$(".right_main ul li img:[data]"),num=oj.length;
		var wid_p = $('.continer').width();

		$('.left_nav li a').hover(function(){
			$(this).addClass('s1');	
			},
			function(){
				$(this).removeClass('s1');
		});
/* 		$('.left_nav li a').click(function(){
			$('.left_nav li a').removeClass('s1').addClass('s2');
			$(this).removeClass('s2').addClass('s1');
		}); */
		
		$('.right_main li a').hover(function(){
			$(this).removeClass('b2').addClass('b1');	
			},
			function(){
				$(this).removeClass('b1').addClass('b2');
		});
		
		$('.right_main li a').click(function(){
			$.get($(this).attr('data'),'',function(data){
				$('#dialog').html(data);
			});
		
			var wid_s = $('#dialog').width(),wid = (wid_p-wid_s)/2;
			$('#dialog').position({'left':wid});
			$('#dialog').fadeIn(1000);
			$('.ui-widget-overlay').fadeIn(500);
		
		});

});
</SCRIPT>

<DIV class="ui-widget-overlay" style='filter: alpha(opacity=60); background-image: url("ui-bg.png");'></DIV>
<DIV id="dialog" title="Basic modal dialog"></DIV>
<DIV id="wrap" style="background-color: rgb(255, 255, 255);">
	<DIV class="continer opus">
		<DIV class="left_nav">
			<UL>
					<LI style="padding-right: 50px;">
						<A href="towelAction_findPageByCategory.action?pageNum=1&pageSize=${page.pageSize }&categoryId=-1">所有产品</A>
					</LI>
				<c:forEach var="category" items="${categorys }">
					<LI style="padding-right: 50px;">
						<A href="towelAction_findPageByCategory.action?pageNum=1&pageSize=${page.pageSize }&categoryId=${category.id }">${category.name }</A>
					</LI>
				</c:forEach>
			</UL>
		</DIV>
		<DIV class="right_main">
			<DIV style="text-align: right; padding-right: 24px; padding-bottom: 24px;">
				<A style="color: rgb(99, 54, 43); font-size: 14px;" href="javascript:void(0)">查看简历&gt;&gt;</A>
			</DIV>
			<UL>
					<% int imgIndex=0; %>
				<c:forEach var="towel" items="${page.list }">
					<% ServletActionContext.getRequest().setAttribute("imgIndex",imgIndex);
					   imgIndex++; %>
					<LI>
						<a data="towelAction_imgShowData.action?pageNum=${page.pageNum }&pageSize=${page.pageSize }&imgIndex=${imgIndex }&categoryId=${categoryId }" href="javascript:void(0)" class="b2">
							<img title="${towel.name }" src="images/thum_${towel.image}" width="90" height="90" data="images/${towel.image}"/>
						</a>
					</LI>
				</c:forEach>
			</UL>
			<DIV class="page">
				<c:if test="${page.pageNum > 1}">
					<A href="towelAction_findPageByCategory.action?pageNum=${page.pageNum - 1}&pageSize=${page.pageSize }&categoryId=${categoryId }">
						<IMG src="common/css/p-left.gif">
					</A>
				</c:if>
				<c:if test="${page.totalPage !=0}">
					${page.pageNum }/${page.totalPage } 页
				</c:if>
				<c:if test="${page.totalPage ==0}">
					<h1 align="center">此类别下还没有产品。</h1>
				</c:if>
				<c:if test="${page.pageNum < page.totalPage}">
					<A href="towelAction_findPageByCategory.action?pageNum=${page.pageNum + 1}&pageSize=${page.pageSize }&categoryId=${categoryId }">
						<IMG src="common/css/p-right.gif">
					</A>
				</c:if>
			</DIV>
		</DIV>
	</DIV>
</DIV>
<DIV class="footer"><SPAN style="margin-top: 3px;">Copyright© 2011 XUDAMING 
ART.All Rights Reserved </SPAN><BR><SPAN>苏ICP备11019601号-2</SPAN>
</DIV>
</body>
</html>